<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8" />
    <link href="../static/global/plugins/font-awesome/css/font-awesome.min.css" th:href="@{/global/plugins/font-awesome/css/font-awesome.min.css}" rel="stylesheet" type="text/css" />
    <link href="../static/global/plugins/bootstrap/css/bootstrap.min.css" th:href="@{/global/plugins/bootstrap/css/bootstrap.min.css}" rel="stylesheet" type="text/css" />
    <link href="../static/global/css/components.min.css" th:href="@{/global/css/components.min.css}" rel="stylesheet" id="style_components"  type="text/css" />
    <link href="../static/global/css/plugins.min.css" th:href="@{/global/css/plugins.min.css}" rel="stylesheet" type="text/css" />
    <link href="../static/layouts/layout/css/layout.css" th:href="@{/layouts/layout/css/layout.css}" rel="stylesheet" type="text/css" />
    <link href="../static/global/plugins/datatables/datatables.min.css" th:href="@{/global/plugins/datatables/datatables.min.css}" rel="stylesheet" type="text/css" />
    <link href="../static/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css" th:href="@{/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.css}" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="page-bar">
    <ul class="page-breadcrumb">
        <li>
            <a href="#">用户权限管理</a>
            <i class="fa fa-circle"></i>
        </li>
        <li>
            <span>角色管理</span>
        </li>
    </ul>
</div>

<div class="row">
    <div class="col-md-12">
        <form class="form-horizontal" id="filter_form" action="#">
            <div class="form-body">
                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">角色站点</label>
                            <div class="col-md-9">
                                <select class="form-control form-filter" name="siteNo" id="siteNo">
                                    <option value=""></option>
                                    <option th:each="site:${sites}" th:value="${site.siteNo}" th:text="${site.name}"></option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="form-group">
                            <label class="control-label col-md-3">角色名称</label>
                            <div class="col-md-9">
                                <input type="text" name="role" id="role" class="form-control form-filter"/>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <div class="col-md-offset-3 col-md-9">
                        <button class="btn green" id="query_button" type="button">查询</button>
                        <button class="btn default" id="clean_button" type="button">清空</button>
                    </div>
                </div>
            </div>
        </form>
    </div>
    <div class="col-md-12">
        <div class="portlet light bordered">
            <div class="portlet-title">
                <div class="caption font-dark">
                    <i class="icon-settings font-dark"></i>
                    <span class="caption-subject bold uppercase">角色列表</span>
                </div>
                <div class="actions">
                    <div class="btn-group">
                        <a class="btn dark btn-outline btn-circle btn-sm" href="javascript:;" data-toggle="dropdown" data-hover="dropdown" data-close-others="true">操作
                            <i class="fa fa-angle-down"></i>
                        </a>
                        <ul class="dropdown-menu pull-right">
                            <li shiro:hasPermission="role:create">
                                <a href="javascript:;" id="create_button">新增</a>
                            </li>
                            <li shiro:hasPermission="role:update">
                                <a href="javascript:;" id="update_button">修改</a>
                            </li>
                            <li  shiro:hasPermission="role:delete">
                                <a href="javascript:;" id="delete_button">删除</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="portlet-body">
                <table class="table table-striped table-bordered table-hover" id="my_table">
                    <thead>
                    <tr>
                        <th>id</th>
                        <th>站点编号</th>
                        <th>角色名称</th>
                        <th>角色描述</th>
                        <th>状态</th>
                        <th>更新时间</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<!-- END FOOTER -->
<!--[if lt IE 9]>
<script src="../static/global/plugins/respond.min.js" th:src="@{/global/plugins/respond.min.js}"></script>
<script src="../static/global/plugins/excanvas.min.js" th:src="@{/global/plugins/excanvas.min.js}"></script>
<script src="../static/global/plugins/ie8.fix.min.js" th:src="@{/global/plugins/ie8.fix.min.js}"></script>
<![endif]-->
<script src="../static/global/plugins/jquery.min.js" th:src="@{/global/plugins/jquery.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/bootstrap/js/bootstrap.min.js" th:src="@{/global/plugins/bootstrap/js/bootstrap.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js" th:src="@{/global/plugins/bootstrap-hover-dropdown/bootstrap-hover-dropdown.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js" th:src="@{/global/plugins/jquery-slimscroll/jquery.slimscroll.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/jquery.blockui.min.js" th:src="@{/global/plugins/jquery.blockui.min.js}" type="text/javascript"></script>
<script src="../static/global/scripts/app.js" th:src="@{/global/scripts/app.js}" type="text/javascript"></script>
<script src="../static/layouts/layout/scripts/layout.js" th:src="@{/layouts/layout/scripts/layout.js}" type="text/javascript"></script>
<script src="../static/global/scripts/datatable.js" th:src="@{/global/scripts/datatable.js}" type="text/javascript"></script>
<script src="../static/global/plugins/datatables/datatables.min.js" th:src="@{/global/plugins/datatables/datatables.min.js}" type="text/javascript"></script>
<script src="../static/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js" th:src="@{/global/plugins/datatables/plugins/bootstrap/datatables.bootstrap.js}" type="text/javascript"></script>
<script src="../static/layouts/page/scripts/rbac_role_list.js" th:src="@{/layouts/page/scripts/rbac_role_list.js}" type="text/javascript"></script>
</body>
</html>